<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
        <p>
            账号：<input id="user" type="text">
        </p>
        <p>
            密码：<input id="pwd" type="text">
        </p>
        <p>
            <button id="btn">登录</button>
        </p>
    </div>    



    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.27.2/axios.js"></script>
    <script>
        const user = document.getElementById("user")
        const pwd = document.getElementById("pwd")
        const btn = document.getElementById("btn")


        // axios  基于promise的方式对ajax进行封装
        // 二次封装

        // interceptors  拦截
        // console.log()
        axios.interceptors.request.use((config) => {
            // config   当前请求的信息
            const token = sessionStorage.getItem("token")? sessionStorage.getItem("token"): ""
            config.headers.token = token
            console.log(config.headers)
            return config
        })

        btn.addEventListener('click', () => {
            axios.post("http://127.0.0.1:4567/login", {
                userName: user.value,
                passWord: pwd.value
            }).then(res => {
                // 登录以后存储一下token
                sessionStorage.setItem("token", res.data.token)

                axios.get("http://127.0.0.1:4567/getUserInfo").then(res => {
                    console.log(res)
                })

                // location.href = "./info.html"
            })
        })
    </script>
</body>
</html>